<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Beebud</title>
  <script src="./js/ofs.js"></script>
  <link rel="stylesheet" href="./css/beebud.css">
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/ruzhu.css">
  <link rel="stylesheet" href="./css/goodsDetail.css">
  <link rel="shortcut icon" href="./logo.png" type="image/x-icon">
  <script src="./js/vue.min.js"></script>
  <style>

  </style>
</head>

<body>
  <div id="app">
    <header>
      <div class="header-wrapper">
        <div class="logo"><a href="./index.html"><img src="./img/logo.png" alt=""></a>
        </div>
        <div class="search-wrapper">
          <!-- <input type="text" placeholder="登录搜索更多内容">
          <?xml version="1.0" encoding="UTF-8"?><svg width="14" height="14" viewBox="0 0 48 48" fill="none"
            xmlns="http://www.w3.org/2000/svg">
            <path
              d="M21 38C30.3888 38 38 30.3888 38 21C38 11.6112 30.3888 4 21 4C11.6112 4 4 11.6112 4 21C4 30.3888 11.6112 38 21 38Z"
              fill="none" stroke="#000" stroke-width="4" stroke-linejoin="round" />
            <path d="M26.657 14.3431C25.2093 12.8954 23.2093 12 21.0001 12C18.791 12 16.791 12.8954 15.3433 14.3431"
              stroke="#000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" />
            <path d="M33.2216 33.2217L41.7069 41.707" stroke="#000" stroke-width="4" stroke-linecap="round"
              stroke-linejoin="round" />
          </svg> -->
        </div>

        <div class="nav-wrapper">
          <span><a href="./about.html">关于我们</a> </span>
          <span><a href="./goodsList.html">商品列表</a> </span>
          <span><a href="./ruzhu.html">商家入驻</a> </span>
          <span><a href="./concatUs.html">联系我们</a> </span>
          <span><a href="./help.html" class="help-a">服务与帮助</a> </span>
        </div>
        <div class="login-register">
          <span><a href="./register.html">注册</a></span>
          <button><a href="./login.html">登录</a></button>
        </div>
      </div>
    </header>
    <!-- <section class="banner">
      <div class="banner-wrapper">
        <img src="./img/banner.png" alt="">
        <div class="banner-text">
          <div class="text-1">每个人都有自己的能量</div>
          <div class="text-2">即使再小的需求和兴趣，你都能得到即可满足</div>
        </div>
      </div>
    </section> -->
    <main>
      <!-- <div class="main-left">
        <ul>
          <li>分类1</li>
          <li>分类1</li>
          <li>分类1</li>
          <li>分类1</li>
        </ul>
      </div> -->
      <div class="main-right">
        <div class="goods-detail">
          <!-- <h2>店铺简介</h2> -->
          <!-- <div class="goods-info">
            <img src="" alt="">
            <div class="good-content">
              <h3>很长的标题很长的标题很长的标题很长的标题很长的标题</h3>
              <p class="price">零售价：￥12454</p>
              <p>商家店铺：玲玲玩具店</p>
              <p>数量：</p>
              <p>
                <input type="number" name="" id="" class="number" value="1">
                <button class="cart">加入购物车</button>
                <button class="buy">立即购买</button>
              </p>
            </div>
          </div> -->
          <div>
            <img src="./img/ruzhu.png" alt="">
          </div>
        </div>
        <div class="goods-desc" style="margin-top: 50px;">
          <!-- <h2>店铺商品</h2> -->
          <div class="row justify-content-center justify-content-lg-between" style="display: flex;">
            <div class="col-lg-6 col-md-8 order-2 order-lg-0" style="flex: 1;margin-right: 20px;">
              <div class="contact-title mb-20">
                <h2 class="title">商家入驻</h2>
              </div>
              <div class="contact-wrap-content">
                <p>请登录以后填写以下信息.</p>
                <form action="#" class="contact-form">
                  <div class="form-grp"><label for="name">您的姓名 <span>*</span></label><input v-model="formData.name"
                      type="text" id="name" placeholder=""></div>
                  <div class="form-grp"><label for="email">您的邮箱 <span>*</span></label><input v-model="formData.email"
                      type="text" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">店铺名称 <span>*</span></label><input v-model="formData.shopName"
                      type="text" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">店铺地址 <span>*</span></label><input v-model="formData.address"
                      type="text" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">经营类目 <span>*</span></label><input v-model="formData.type"
                      type="text" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">营业执照 <span>*</span></label><input v-model="formData.zhizhao"
                      type="file" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">店铺店照 <span>*</span></label><input
                      v-model="formData.shopPhoto" type="file" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">身份证正面 <span>*</span></label><input v-model="formData.card1"
                      type="file" id="email" placeholder=""></div>
                  <div class="form-grp"><label for="email">身份证反面 <span>*</span></label><input v-model="formData.card2"
                      type="file" id="email" placeholder=""></div>

                  <button type="button" class="btn rounded-btn" @click="onSubmit">立即入驻</button>
                </form>
              </div>
            </div>
            <!-- <div class="col-xl-5 col-lg-6 col-md-8" style="flex: 1;">
              <div class="contact-info-wrap">
                <div class="contact-img"><img src="/theme/lu_edi18_hn/static/picture/contact_img.png" alt=""></div>
                <div class="contact-info-list">
                  <ul>
                    <li>
                      <div class="icon"><i class="fas fa-map-marker-alt"></i></div>
                      <div class="content">
                        <p>浙江省杭州市钱塘区河庄街道河中路351号2楼201室 </p>
                      </div>
                    </li>
                    <li>
                      <div class="icon"><i class="fas fa-phone-alt"></i></div>
                      <div class="content">
                        <p>18957821991 </p>
                      </div>
                    </li>
                    <li>
                      <div class="icon"><i class="fas fa-envelope-open"></i></div>
                      <div class="content">
                        <p>441079250@qq.com </p>
                      </div>
                    </li>
                  </ul>
                </div>

              </div>
            </div> -->
          </div>
        </div>
      </div>
    </main>
    <footer>
      <div class="footer-wrapper">
        <div>
          <div>
            <span>上海灼蕾网络科技有限公司</span>
            <div style="margin-left: 20px;"><a href="https://beian.miit.gov.cn" target="_blank"
                rel="noopener noreferrer">沪ICP备2024048955号</a> </div>
          </div>
          <div>
            <span>地址：上海市长宁区凯旋路1205号1号楼 三 楼 3C 室</span>
          </div>
        </div>
      </div>
    </footer>

  </div>
  <script src="./js/common.js"></script>
  <!-- <script src="./js/index.js"></script> -->
  <script>
    new Vue({
      el: '#app',
      data() {
        return {
          goodsInfo: {},
          formData: {
            name: '',
            email: '',
            shopName: '',
            address: '',
            type: '',
            zhizhao: '',
            shopPhoto: '',
            card1: '',
            card2: ''
          }
        }
      },
      mounted() {
        this.getDetail();
      },
      methods: {
        async getDetail() {
          const res = await request('/web/goodsDetail', 'post', {
            id: getQueryVariable("id")
          })
          this.goodsInfo = res.data;
        },
        onSubmit() {
          if (!this.formData.name || !this.formData.email || !this.formData.shopName || !this.formData.address || !this.formData.type || !this.formData.zhizhao || !this.formData.shopPhoto || !this.formData.card1 || !this.formData.card2) {
            toast('请填写完整信息')
            return;
          }
          window.location.href = './login.html'
        }
      }
    })
  </script>
</body>

</html>